html,body{
  width: 100%;
  height: 100%;
  background-color: #f8f8f8;
}
main{
  width: 1190px;
  height: 809px;
  margin: 0 auto;
  margin-top: 20px;
  .left{
    width: 228px;
    height: 807px;
    float: left;
    .top{
      width: 228px;
      height: 632px;
      float: left;
       border: 1px solid #eaeaea;
       border-radius: 4px;
       background-color: white;
        .tops{
          width: 178px;
          height: 566px;
          float: left;
          margin-left: 32px;
          margin-top: 25px;
          .tilte{
            float: left;
            width: 178px;
            height: 33px;
            margin-top: 12px;
            line-height: 33px;
            font-size: 18px;
            color: #222222;
            cursor: pointer;
            &:hover{
              color: #FE8C00;
            }
          }
          .tilte:nth-child(1){
            margin-top: 0 ;
          }
          .All{
            float: left;
            width: 178px;
            height: 164px;
            margin-bottom: 12px;
            cursor: pointer;
            li{
              color: #666666;
              margin: 12px 0;
              strong{
                float: right;
                color:#494949;
              }
            }
          }
         .Al{
          float: left;
          width: 178px;
          height: 64px;
          margin-bottom: 12px;
          cursor: pointer;
          li{
            color: #666666;
            margin: 12px 0;
            strong{
              float: right;
              color:#494949;
            }
          }
         }
         .As{
          float: left;
          width: 178px;
          height: 21px;
          margin-top: 12px;
          cursor: pointer;
          li{
            color: #666666;
            strong{
              float: right;
              color:#494949;
            }
          }
         }
        }
    }
    .bottom{
      width: 228px;
      height: 165px;
      float: left;
      margin-top: 10px;
      border: 1px solid #eaeaea;
      background-color: white;
      .er{
        width: 228px;
        height: 112px;
        float: left;
        .erweima{
            margin-top: 20px;
            width: 75px;
            height: 75px;
            margin-left: 77px;
            background: url(//s1.meituan.net/bs/fe-web-meituan/60ac9a0/img/download-qr.png);
            background-size:75px 75px;
        }
    }
    .app{
        font-size: 16px;
        color: #222222;
        font-weight: 500;
        margin-top: 10px;
        text-align: center;
        margin-bottom: 3px;
    }
    .yuan{
        text-align: center;
        font-size: 12px;
        font-weight: 500;
        .red{
            color: #EC5330;
            margin-right: 5px;
        }
        .gary{
            color: #3f3f3f;
        }
    }
    }
  }
  .right{
    width: 948px;
    min-height: 70px;
    float: right;
    background-color: white;
    border: 1px solid #e5e5e5;
    border-bottom: none;
    border-radius: 4px;
    table{
    width: 908px;
    min-height: 70px;
    margin: 0 auto;  
    thead{
      width: 908px;
      min-height: 70px;
      tr{
        th{
          border-bottom:1px solid #e5e5e5;
          font-size: 20px;
          width: 108px;
          height: 70px;
        }
        th:nth-child(2){
          width: 296px;
        }
        th:nth-child(4){
          width: 156px;
        }
        th:nth-child(5){
          width: 135px;
        }
      }
    }
    tbody tr{
      margin: 20px 0;
    }
    tbody tr td{
      text-align: center;
      border-bottom: 1px solid #e5e5e5;
      }
    tbody tr td:nth-child(2){
      width: 295px;
      height: 80px;
      img{
        width: 100px;
        height: 80px;
        float: left;
        margin-top: 10px;
        margin-left: 50px;
        }
        span{
          width: 100px;
          float: left;
          margin-top: 37px;
          margin-left: 15px;
          }
      }
      tbody tr td:nth-child(4) span{
        width: 20px;
        height: 22px;
        border:1px solid #E5E5E5;
        float: left;
        text-align: center;
        line-height: 20px;
        cursor: pointer;
        border-radius: 3px;
        &:hover{
          border:1.5px solid #FE8C00;
        }
        }
        tbody tr td:nth-child(4) span:nth-child(1){
          margin-left: 35px;
          }
          tbody tr td:nth-child(4) input{
            width: 50px;
            height: 22px;
            float: left;
            border:1px solid #E5E5E5;
            outline: none;
            text-align: center;
            &:hover{
              border:1.5px solid blue;
              border-radius: 3px;
            }
            }
            tbody tr td:nth-child(5) span{
              color: red;
              font-weight: 900;
              }
              tbody tr td:nth-child(6) span{
              cursor: pointer;
              &:hover{
              color: red;
           }
              }
    }
    .footer{
      width: 908px;
      height: 70px;
      margin: 0 auto;
      border: 2px solid #f6f6f6;
      border-radius: 5px;
      margin-top: 15px;
    }
    .footer .left{
      width: 200px;
      height: 100%;
      float: left;
      line-height: 70px;
      }
      .footer .left input{
      margin: 10px 50px;
      }
      .footer .left span{
      color: #000;
      cursor: pointer;
      &:hover{
        color: red;
      }
      }
      .footer .rirght{
      width: 363px;
      height: 100%;
      float: right;
      }
      .footer .rirght .allNum{
      width: 100px;
      height: 100%;
      float: left;
      line-height: 70px;
      text-align: center;
      }
      .footer .rirght .allNum b{
      color: red;
      }
      .footer .rirght .allCount{
      width: 195px;
      height:70px;
      float: left;
      line-height: 70px;
      text-align: center;
      }
      .footer .rirght .count b{
      color: red;
      }
      .footer .rirght .calc{
      width: 68px;
      height: 70px;
      float: right;
      line-height: 70px;
      cursor: pointer;
      }
      .sy{
      height: 70px;
      text-align: center;
      line-height: 50px;
      font-size: 20px;
      font-weight: bold;
      }
      .hide{
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 1;
      overflow: hidden;
      }
  }
}